<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
	<head>
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>普提阁购物车</title>
		<link rel="stylesheet" href="${pageContext.request.contextPath }/css/bootstrap.min.css" type="text/css" />
		<script src="${pageContext.request.contextPath }/js/jquery-1.11.3.min.js" type="text/javascript"></script>
		<script src="${pageContext.request.contextPath }/js/bootstrap.min.js" type="text/javascript"></script>
		<!-- 引入自定义css文件 style.css -->
		<link rel="stylesheet" href="${pageContext.request.contextPath }/css/style.css" type="text/css" />
		<style>
			body {
				margin-top: 20px;
				margin: 0 auto;
			}
			
			.carousel-inner .item img {
				width: 100%;
				height: 300px;
			}
			
			font {
				color: #3164af;
				font-size: 18px;
				font-weight: normal;
				padding: 0 10px;
			}
		</style>
	</head>

	<body>
		<!-- 引入header.jsp -->
		<jsp:include page="/front/header.jsp"></jsp:include>

		<div class="container">
		    <c:if test="${empty cart}">
		    <div style="text-align:center" >
		        <img  alt="" src="${pageContext.request.contextPath }/images/11.jpg"><br><br>
		        <a href="${pageContext.request.contextPath }/productServlet">点餐</a>
		    </div>
		    </c:if>
		    <c:if test="${!empty cart}">
			<div class="row">

				<div style="margin:0 auto; margin-top:10px;width:950px;">
					<strong style="font-size:16px;margin:5px 0;">订单详情</strong>
					<table class="table table-bordered">
						<tbody>
							<tr class="warning">
								<th>图片</th>
								<th>商品</th>
								<th>价格</th>
								<th>数量</th>
								<th>小计</th>
								<th>操作</th>
							</tr>
							<c:forEach items="${cart.cartItems}" var="entry">
							<tr class="active">
								<td width="60" width="40%">
									<input type="hidden" name="id" value="22">
									<img src="${entry.value.goods.imgUrl}" width="70" height="60">
								</td>
								<td width="30%">
									<a target="_blank">${entry.value.goods.goodsName}</a>
								</td>
								<td width="20%">
									￥${entry.value.goods.price}
								</td>
								<td width="10%">
								<form action="${pageContext.request.contextPath }/updateBuyNumServlet" method="get">
								    <input type="hidden" name="id" value="${entry.value.goods.id}">
									<input type="text" name="buyNum" value="${entry.value.buyNum}" maxlength="4" size="5">
									<input type="submit" value="修改">
								</form>
								</td>
								<td width="15%">
									<span class="subTotal">￥${entry.value.subTotal}</span>
								</td>
								<td>
									<a href="${pageContext.request.contextPath }/deleteCartItemServlet?id=${entry.value.goods.id}" onclick="return delete1() " class="delete">删除</a>
								</td>
							</tr>
							</c:forEach>
						</tbody>
					</table>
				</div>
			</div>

			<div style="margin-right:130px;">
				<div style="text-align:right;">
					<em style="color:#ff6600;">
			</em>&nbsp; 总价: <strong style="color:#ff6600;">￥${cart.total}</strong>
				</div>
				<div style="text-align:center;margin-top:10px;margin-bottom:10px;">
				<a href="${pageContext.request.contextPath }/productServlet" class="clear" style="color: green">继续点餐</a>
			   </div>
				<div style="text-align:right;margin-top:10px;margin-bottom:10px;">
					<a href="${pageContext.request.contextPath }/cleanCartServlet" id="clear" onclick=" return clearCart() " class="clear">清空购物车</a>
					<a href="${pageContext.request.contextPath }/submitOrderServlet">
						<input type="submit" width="100" value="提交订单" name="submit" border="0" style="background: url('${pageContext.request.contextPath }/images/register.gif') no-repeat scroll 0 0 rgba(0, 0, 0, 0);
						height:35px;width:100px;color:white;">
						${timeMsg}
					</a>
				</div>
			</div>
			</c:if>
<%--			￥${cart.total}--%>
		</div>

		<!-- 引入footer.jsp -->
		<jsp:include page="/front/footer.jsp"></jsp:include>

	</body>


<script>

	function clearCart() {

		var b = window.confirm("你确定要清空购物车吗？");

		//如果用户确定，就跳转到相对应的Servlet上
		if(b) {
			return true;
		}else {
			return false;
		}
	}
	function delete1() {

		var c= window.confirm("你确定要删除菜品吗？");

		//如果用户确定，就跳转到相对应的Servlet上
		if(c) {
			return true;
		}else {
			return false;
		}
	}


</script>

</html>